<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<form>
		  <label for="username">用户名:</label>
		  <input type="text" id="username" name="username" required><br><br>
		  <input type="button" value="检查用户名" onclick="checkUsername()">
		  <p id="feedback"></p>
		</form>
	</body>
<ml>
<script>
	function checkUsername() {
	  let username = document.getElementById("username").value;
	  let feedback = document.getElementById("feedback");
	  
	  // 创建XHR对象
	  let xhr = new XMLHttpRequest();
	  
	  // 设置请求的URL和HTTP方法
	  xhr.open('GET', 'check_username.php?username=' + username, true);
	
	  // 处理服务器的响应
	  xhr.onload = function() {
	    if (xhr.status == 200) {
	      if (xhr.responseText == 'exist') {
	        feedback.innerHTML = '该用户名已被使用';
	      } else {
	        feedback.innerHTML = '用户已存在';
	      }
	    }
	  };
	
	  // 发送请求
	  xhr.send();
	}
</script>
